{% extends "frame/tabpages.html" %}
{% load static %}

{% block content %}
<body>
    <div class="layui-card">
        <div class="layui-card-body ">
            <table id="id_orderDetail" class="layui-table layui-form" lay-filter="f_orderDetail"></table>
        </div>
    </div>
</body>
{% endblock %}

{% block jsscript %}
<script>
{% include "frame/commJs.html" %}
layui.use(['jquery','table'], function(){
    var table = layui.table;
    var $ = layui.$;

    var loading = layer.load(0, {shade: false});
    table.render({
        elem: '#id_orderDetail', 
        method: 'post',
        url: "{% url 'order:show_orderDetail' order_id %}", //数据接口
        height: 'full-80',
        page: true, //开启分页
        limit: 10,
        loading: true,
        defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
            title: '提示',
            layEvent: 'LAYTABLE_TIPS',
            icon: 'layui-icon-tips',
            }],
        cols: [[ //表头
            {type: 'numbers',   title: '序号',    width:'5%',  align:'center'},
            {field: 'name',  title: '产品名称',   width:'30%', align:'center', sort: true},
            {field: 'spec',  title: '产品型号',   width:'30%', align:'center', sort: true},
            {field: 'count', title: '数量',       align:'center', sort: true}
        ]],
        done:function(res){
            layer.close(loading);
            tdTitle();
        }
    });  

});
</script>
{% endblock %}
